<script lang="ts">
	import type { SimpleQuestion } from '$lib/api/proto/resource_exam_type_api';

	interface Props {
		question: SimpleQuestion;
		onChange: (question: SimpleQuestion) => void;
	}
	let props: Props = $props();
	let question = $state(props.question.question);
	let sampleAnswer = $state(props.question.sampleAnswer);

	$effect(() => {
		props.onChange({
			question,
			sampleAnswer
		});
	});
</script>

<div class="space-y-2">
	<label class="label w-full">
		<span class="label w-[100px] text-right inline-block pr-[10px]">问题:</span>
		<input type="text" class="input w-full" bind:value={question} />
	</label>
	<label class="label w-full">
		<span class="label w-[100px] text-right inline-block pr-[10px]">参考答案:</span>
		<textarea class="textarea w-full" rows="10" bind:value={sampleAnswer}></textarea>
	</label>
</div>
